<template>
  <div>
  <!--购买就-->
  <div class="mainBox">
    <div class="lay_5 clearfix">
      <div class="lay_3_tle">
        <span></span><p>酒世界</p><span></span>
      </div>
      <div class="lay_5_left">
        <a href="https://www.winex-hk.com/item/203690.html" target="_blank">
          <img src="../../assets/img/20180928191134_2281.jpg" alt="蓓姬城堡副牌干红葡萄酒2012" /></a>
      </div>
      <div class="lay_5_center">
        <a style="display: block;background-color: #e0e6fe;" href="https://www.winex-hk.com/item/203529.html" target="_blank">
          <img src="../../assets/img/20180930200207_4183.png" alt="精品酒" /></a>
        <div id="lb_3">
          <ul>
            <li><img src="../../assets/img/20180928192131_1041.jpg" alt="" width="474" height="308" style="padding-left: 0px;"/></li>
            <li><img src="../../assets/img/20180928192055_6406.jpg" alt="" width="474" height="308"/></li>
          </ul>
          <div>
            <p class="active"></p><p></p>
          </div>
        </div>
      </div>
      <div class="lay_5_right_pro clearfix">
        <div class="lay_5_right_pro1">
          <a href="https://www.winex-hk.com/item/203537.html" target="_blank"><img src="../../assets/img/20180930113016_9703.png" alt="史密斯拉菲城堡干红葡萄酒2011 " /></a>
        </div>
        <div class="lay_5_right_pro2">
          <a href="https://www.winex-hk.com/item/203526.html" target="_blank"><img src="../../assets/img/20180930113016_9703.png" alt="雪兰城堡干红葡萄酒2015" /></a>
        </div>
        <div class="lay_5_right_pro3">
          <a href="https://www.winex-hk.com/item/203643.html" target="_blank"><img src="../../assets/img/20180930113027_6118.png" alt="马利哥城堡副牌干红葡萄酒2013" /></a>
        </div>
        <div class="lay_5_right_pro4">
          <a href="https://www.winex-hk.com/item/203662.html" target="_blank"><img src="../../assets/img/20180930113027_6118.png" alt="歌碧城堡干红葡萄酒2014 " /></a>
        </div>
        <div class="lay_5_right_pro5">
          <a href="https://www.winex-hk.com/item/203646.html" target="_blank"><img src="../../assets/img/20180930113048_4758.png" alt="克莱蒙教皇城堡副牌干红葡萄酒2013 " /></a>
        </div>
        <div class="lay_5_right_pro6">
          <a href="https://www.winex-hk.com/item/203542.html" target="_blank"><img src="../../assets/img/20180930113059_0113.png" alt="荔仙城堡干红葡萄酒2014 " /></a>
        </div>
      </div>
    </div>
  </div>
    <!--    底部-->
    <footer id="footer">
      <div class="footer clear">
        <div class="footer-top">
          <span></span>
          <p>套餐优惠</p>
          <span></span>
        </div>
        <div class="footer-middle clear">
          <ul class="clear">
            <li style="list-style: none">
              <img src="../../assets/images/index/3917_jbrnt7ky.png" alt="">
            </li>
            <li style="list-style: none">
              <img src="../../assets/img/footer-icon1.png">
              <a href="#" style="text-decoration: none; color: black"><p>原产地直供</p></a>
            </li>
            <li style="list-style: none">
              <img src="../../assets/img/footer-icon1.png">
              <a href="#" style="text-decoration: none; color: black"><p>跨境零关税</p></a>
            </li>
            <li style="list-style: none">
              <img src="../../assets/img/footer-icon1.png">
              <a href="#" style="text-decoration: none; color: black"><p>恒温恒湿仓储</p></a>
            </li>
            <li style="list-style: none">
              <img src="../../assets/img/footer-icon1.png">
              <a href="#" style="text-decoration: none; color: black"><p>保税区直邮</p></a>
            </li>
          </ul>
        </div>
        <div class="footer-bottom clear">
          <div class="footer-left">
            <ul class="clear">
              <li style="list-style: none">
                <a href="#" style="text-decoration: none; color: black"><p>关于我们</p>
                  平台介绍<br>海外直供<br>正品保证</a>
              </li>
              <li style="list-style: none">
                <a href="#" style="text-decoration: none; color: black"><p> 专业特色</p>
                  存酒库<br>
                  南昌贸易有限公司</a>
              </li>
              <li style="list-style: none">
                <a href="#" style="text-decoration: none; color: black"><p>购物指南</p>

                  跨境电商说明<br>
                  购物流程</a>
              </li>
              <li style="list-style: none">
                <a href="#" style="text-decoration: none; color: black"> <p> 支付和配送</p>
                  支付方式<br>
                  物流配送<br>
                  快递查询</a>
              </li>
              <li style="list-style: none">
                <a href="#" style="text-decoration: none; color: black"><p>售后服务</p>
                  售后说明<br>
                  隐私保护政策</a>
              </li>
            </ul>
          </div>
          <div class="footer-right">
            <a href="#" style="text-decoration: none; color: black"> <h3>联系我们</h3></a>
            <a href="#" style="text-decoration: none; color: black"><p>电话：123456789</p></a>
            <a href="#" style="text-decoration: none; color: black"><p>地址：江西省南昌市南昌县XXX区</p></a>
            <a href="#" style="text-decoration: none; color: black"> <p>邮箱：100000@qq.com</p></a>
          </div>
        </div>
      </div>
    </footer>
  </div>
</template>

<script>
export default {
  name: "Purchase",
  data(){

  },
}
</script>

<style scoped>
/*精品拼推荐
*/

.mainBox {
  width: 1200px;
  margin: 20px auto;
  background: #f4f4f4;
  position: relative;
}

.row:before {
  display: table;
  content: " ";
}
.lay_3_tle {
  overflow: hidden;
  text-align: center;
  margin-bottom: 30px;
}
.lay_3_tle span {
  border: 1px solid #797979;
  display: inline-block;
  vertical-align: middle;
  width: 100px;
}
.lay_3_tle p {
  color: #000;
  font-size: 24px;
  margin: 0 20px;
  display: inline-block;
  vertical-align: middle;
  font-weight: bold;
}
.lay_5_left {
  width: 345px;
  height: 540px;
  overflow: hidden;
  float: left;
}
.lay_5_left a {
  color: #666;
  text-decoration: none;
  background-color: transparent;
}

.lay_5_left img,.lay_5_right_pro img {
  vertical-align: middle;
  border: 0;
}
.lay_5_center {
  float: left;
  margin-left: 20px;
  height: 540px;
  width: 474px;
  overflow: hidden;
}

.lay_5_banner {
  width: 474px;
  height: 308px;
  overflow: hidden;
}
#Slide1 {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.lay_5_right_pro {
  float: left;
  overflow: hidden;
  width: 360px;
}
.lay_5_right_pro1 {
  float: left;
  background-color: #def7e6;
}
.lay_5_right_pro a {
  display: block;
  width: 180px;
  height: 180px;
}
.lay_5_right_pro div{
  float:left;
  background-color: #def7e6;
}
.lay_5_right_pro div:nth-child(2){
  background-color: #fbf8d8;
}
.lay_5_right_pro div:nth-child(3){
  background-color: #f5dbcc;
}
.lay_5_right_pro div:nth-child(4){
  background-color: #e0e6fe;
}
.lay_5_right_pro div:nth-child(5){
  background-color: #fbf8d8;
}
.lay_5_right_pro div:nth-child(6){
  background-color: #def7e6;
}


.btn-group-vertical>
.btn-group:after,
.btn-toolbar:after,
.clearfix:after,
.container-fluid:after,
.container:after, .dl-horizontal dd:after, .form-horizontal
.form-group:after, .modal-footer:after, .modal-header:after,
.nav:after, .navbar-collapse:after, .navbar-header:after, .navbar:after,
.pager:after, .panel-body:after, .row:after {
  clear: both;
}
.btn-group-vertical>.btn-group:after,
.btn-group-vertical>.btn-group:before, .btn-toolbar:after,
.btn-toolbar:before, .clearfix:after, .clearfix:before,
.container-fluid:after, .container-fluid:before, .container:after,
.container:before, .dl-horizontal dd:after, .dl-horizontal dd:before,
.form-horizontal .form-group:after, .form-horizontal .form-group:before,
.modal-footer:after, .modal-footer:before, .modal-header:after, .modal-header:before,
.nav:after, .nav:before, .navbar-collapse:after, .navbar-collapse:before, .navbar-header:after,
.navbar-header:before, .navbar:after, .navbar:before, .pager:after, .pager:before, .panel-body:after,
.panel-body:before, .row:after, .row:before{
  display:table;
  content:"";
}
/*底部footer*/
/*  footer.css */
.clear:after{
  clear: both;
  display:block;
  content:"";
}
#footer{
  position: absolute;
  width:1400px;
}
#footer .footer{
  min-width:900px;
  padding:0 10px;
  margin-top:70px;
}

#footer .footer-top {
  overflow: hidden;
  text-align: center;
  margin-bottom: 30px;
}
#footer .footer-top p{
  color: #000;
  font-size: 24px;
  margin: 0 20px;
  display: inline-block;
  vertical-align: middle;
  font-weight: bold;
}
#footer .footer-top span{
  border: 1px solid #797979;
  display: inline-block;
  vertical-align: middle;
  width: 100px;
}

#footer .footer-middle{
  background: #fff;
  margin-bottom: 30px;
}
#footer .footer-middle ul{
  width:100%;
  float: left;
  margin: 20px 90px;
}
#footer .footer-middle li{
  color: #383838;
  float: left;
  margin-right:120px;
}
#footer .footer-middle li:nth-child(1){
  background: -webkit-linear-gradient(bottom, #f30213, #ee2746);
  padding:5px;
  border-radius: 3px;
}
#footer .footer-middle li:nth-child(1) img{
  height:80px;
  width:220px;

}
#footer .footer-middle img{
  margin-left:10px;
}
#footer .footer-middle p{
  margin:20px 0;
}

#footer .footer-bottom{
  background: -webkit-linear-gradient(bottom, #f30213, #ee2746);
  position: absolute;
  width: 100%;

  margin-left: -100px;
  padding: 0 100px;
}

#footer .footer-left{
  float: left;
  padding: 15px;
}
#footer .footer-left ul{
  overflow: hidden;

}
#footer .footer-left ul li{
  float: left;
  margin-right: 90px;
  color: #383838;
  font-size: 14px;
  margin-top: 8px;

}
#footer .footer-left ul li p{
  font-size: 16px;
  color: #383838;
  margin-bottom: 12px;
  font-weight: bold;
}

#footer .footer-right{
  float: right;
  color: #383838;
  margin-right:30px;
  margin-top:20px;
}
#footer .footer-right h3{
  margin-top: 8px;
}
#footer .footer-right p{
  font-size: 14px;
}
</style>
